<template>
    <div class='content'>
        <div class='item' >
            
            <div class='item_contents'>
                <div   v-for="(item_,index2) in ltData " :key="index2" :class="item_.className" @dblclick="openLc(item_)">
                    <div class='box-title'>
                        <div class='box-no'>
                            {{item_.sf_ex2}}
                        </div>
                       
                    </div>
                    <div class='box-content'>
                        <div >姓名：{{item_.sz_ex3}}</div>
                        <div >性别：{{item_.sz_ex4}}</div>
                        <div >年龄：{{item_.sz_ex5}}</div>
                        <div >进厅日期：{{item_.lt_dat1}}</div>
                        <div >状&nbsp;&nbsp;&nbsp;&nbsp;态：{{item_.status}}</div>
                    </div>
                    
                </div>
                
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            type:"",
            viewType:"",
            ltData:[]
        }
    },
    created(){
        if(this.$route.query.type){
            this.type=this.$route.query.type;
        }
        if(this.$route.query.viewType){
            this.viewType=this.$route.query.viewType;
        }
        this.loadData();
    },
    methods:{
        loadData(){
            this.$post("bygex","/byg/lt/ltView",{type:this.type,viewType:this.viewType}).then(data=>{
                this.ltData=data;
                console.log(this.ltData,"ltData============")
            })
        }
    }
}
</script>

<style scoped>
   
    .cold{
        padding:10px;
        display: flex;
        flex-direction: column;
        overflow: auto;
    }
    .buttons{
        padding-bottom:10px;
    }
    .content{
        padding:10px;
        display: flex;
        flex-direction: column;
        overflow: auto;
    }
    .title{
        height:30px;
        border:1px solid #ddd;
        line-height:30px;
        margin-bottom:5px;
        padding:5px;
        border-radius:5px;
        background-color:cornflowerblue;
        color:#fff;
        padding-left:10px;
    }
    .item_contents{
        display:flex;
        flex-direction: row;
        flex-flow:row wrap ;
    }
    
    .box-card{
        width:200px;
        height:200px;
        display: flex;
        flex-direction: column;
        box-shadow:0 2px 12px 0 rgba(0,0,0,.1);
        border-radius: 5px;
        margin-right:10px;
        margin-top:10px;
    }
    .bg1{
        background:rgb(200, 215, 243);
    }
    .bg2{
        background:rgb(162, 247, 162);
    }
    .bg3{
        background:rgb(253, 184, 211);
    }
    .box-title{
        border-bottom:1px dashed cornflowerblue;
        height:50px;
        box-sizing: border-box;
        padding:10px;
    }
    .box-no{
        font-size:20px;
        color:cornflowerblue;
        font-weight: bold;
        float:left;
    }
    .box-name{
        float:right;
        font-size:13px;
    }
    
    .el-card__body{
        padding:0 !important;
        height:200px;
    }
    .box-content{
        padding:10px;
        font-size:14px;
        flex:1;
    }
    .box-footer{
        height:30px;
        border-top:1px dashed cornflowerblue;
        display:flex;
        flex-direction: row;
    }
    .box-footer i{
        color:cornflowerblue;
        margin-left:10px;
        cursor: pointer;
        line-height:30px
    }
    .isEdit i{
        color:rgb(34, 153, 34);
        margin-left:10px;
        cursor: pointer;
        line-height:30px
    }
</style>
